/* 中间部分（含商品列表）的样式 */

/* 中间上侧开始 */
.middle-top {
	display: flex;
}

/* 中间上侧左边：开始 */
.middle-top-left {
	width: 270px;
	padding: 20px;
	background-color: #f7f9fa;
	border-radius: 15px;
}

.middle-top-left>h3 {
	margin-bottom: 10px;
}

.middle-top-left-ul {
	line-height: 34px;


}

.middle-top-left-ul>li:hover {
	color: #FF5000;
	cursor: pointer;
}

.middle-top-left-ul>li:hover>a {
	color: #FF5000
}

.middle-top-left-ul>li>a {
	color: #666;
}

.middle-top-left-ul>li>a:hover {
	text-decoration: underline;
}

/* 中间上侧左边：结束 */

/* 中间上侧右边：开始 */
.middle-top-right {
	flex-grow: 1;
	margin-left: 20px;
}

.middle-nav {
	display: flex;
	justify-content: space-between;
	background-color: #f7f9fa;
	border-radius: 15px;
	padding: 10px 20px;
}

.middle-nav>li {
	width: 100px;
	display: flex;
}

.middle-nav>li>a {
	display: inline-block;
	text-align: center;
	flex-grow: 1;
	text-align: center;
}

.middle-nav>li:nth-child(n+2)::before {
	content: "|";
	display: inline-block;
	width: 3px;
	color: #e0e0e0;
}



/* 中间上侧右边：结束 */

/* 中间上侧结束 */

/* 商品列表：开始 */
.h2 {
	display: flex;
	align-items: center;
	padding: 20px;
}

.h2>img {
	height: 20px;
	width: 64px;
	margin-left: 4px;
}

.goods-list {
	display: flex;
	flex-wrap: wrap;
}

.goods-item {
	width: 33.33%;
	padding: 20px;
}

.goods-box {
	display: flex;
	background-color: #f7f9fa;
	border: 1px solid #f7f9fa;
	border-radius: 20px;
	padding: 10px;
}

.goods-box:hover {
	border: 1px solid var(--theme-color);
	cursor: pointer;
}

.goods-img {
	width: 150px;
	height: 150px;
	border-radius: 15px;
}

.goods-img:hover {
	opacity: 0.8;
}

.goods-text-box {
	flex-grow: 1;
	padding-left: 10px;
}

.goods-text-box>h4 {
	height: 46px;
	overflow: hidden;
	line-height: 23px;
	font-weight: 100;
	font-size: 16px;
	margin-bottom: 10px;
}

.goods-tags>span {
	border: 1px solid var(--theme-color);
	font-size: 12px;
	border-radius: 3px;
	padding: 3px;
	color: var(--theme-color);
}

.goods-price {
	color: var(--theme-color);
	font-size: 22px;
	margin-top: 45px;
}

.goods-title:hover {
	color: var(--theme-color);

}

/* 商品列表：结束 */

/* 右侧固定按钮 */
.fixed-btns {
	width: 40px;
	height: 200px;
	background-color: yellow;
	position: fixed;
	right: 0px;
	top: 50%;
	transform: translate(0px,-50%);
}